﻿@using HPIT.RentHouse.DTO
@{
    Layout = "~/Views/Shared/_Layout1.cshtml";
    ViewBag.Title = "Create";
    List<CityDTO> cityList = ViewBag.cityList as List<CityDTO>;
}
<article class="cl pd-20">
    <form class="form form-horizontal" action="@Url.Action("Create", "AdminUsers")" method="post" id="form">
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>手机：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="" id="PhoneNum" name="PhoneNum">
            </div>
            <div class="col-4"> </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>管理员：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="" id="Name" name="Name">
            </div>
            <div class="col-4"> </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>初始密码：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="password" placeholder="密码" autocomplete="off" value="" class="input-text" name="Password" id="Password">
            </div>
            <div class="col-4"> </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>确认密码：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="password" placeholder="确认新密码" autocomplete="off" class="input-text" id="PasswordConfirm" name="PasswordConfirm">
            </div>
            <div class="col-4"> </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">邮箱：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" placeholder="" name="Email" id="Email">
            </div>
            <div class="col-4"> </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">城市：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <select class="select-box" name="CityId">
                    @foreach (var city in cityList)
                    {
                        <option value="@city.Id">@city.Name</option>
                    }
                </select>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">角色选择：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <dl class="permission-list">
                    <dt>
                        <label></label>
                    </dt>
                    <dd>
                        <dl class="cl permission-list2">
                            @foreach (var item in ViewBag.roleList as List<RoldDTO>)
                            {
                                <dt>
                                    <label class="">
                                        <input type="checkbox" value="@item.Id" name="RoleIds">
                                        @item.Name
                                    </label>
                                </dt>
                            }
                        </dl>
                    </dd>
                </dl>
            </div>
        </div>
        <div class="row cl">
            <div class="col-10 col-offset-2">
                <button type="submit" class="btn btn-success radius" id="btn_Add" name="admin-role-save"><i class="icon-ok"></i> 确定</button>
            </div>
        </div>
    </form>
</article>
@section footScript{

    <script>
        $(function () {
            //增加手机号验证规则
            $.validator.addMethod("isMobile", function (value, element) {
                var length = value.length;
                var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
                return this.optional(element) || (length == 11 && mobile.test(value));
            }, "请正确填写您的手机号码");

            $("#form").validate({
                rules: {
                    PhoneNum: {
                        required: true,
                        isMobile: true
                    },
                    Name: {
                        required: true,
                        maxlength: 50
                    },
                    Password: {
                        required: true,
                    },
                    PasswordConfirm: {
                        required: true,
                        equalTo: "#Password"
                    },
                    Email: {
                        email: true
                    }
                },

                messages: {
                    PhoneNum: {
                        required: "不能为空",
                        isMobile: "请输入正确的手机号码"
                    },
                    Name: {
                        required: "不能为空",
                        maxlength: "输入长度最多是50个字符串"
                    },
                    Password: {
                        required: "不能为空"
                    },
                    PasswordConfirm: {
                        required: "不能为空",
                        equalTo: "两次密码不一致"
                    },
                    Email: {
                        email: "请输入正确的邮箱格式"
                    }
                },

                //提交表单
                submitHandler: function (form) {
                    //使用ajax方式提交表单
                    $(form).ajaxSubmit({
                        success: function (data) {
                            console.log(data)
                            //State=1成功，-1失败
                            if (data.State == 1) {
                                //刷新页面
                                parent.location.reload();
                            } else {
                                layer.msg(data.ErrorMessage, { icon: 2 });
                            }
                        }
                    });
                }
            });
        });
    </script>
}
